<template>
    <div class="footer">
        <div>
            <el-checkbox v-model="allSelect" size="large" />
            <span>选中{{ selectNum }}条</span>
            <span>/</span>
            <span>共有{{ all }}条</span>
        </div>
        <div>
            <el-button type="danger" link @click="delSelectAll">删除所选</el-button>
        </div>
    </div>
</template>

<script lang="ts">
import { defineComponent ,ref,computed} from 'vue'

export default defineComponent({
    props:['all','selectNum','allSelectIsOrNo','allSelectInfo','selectAllDel'],
    setup (props) {
        let checked = ref('')
        const allSelect = computed({
            get(){
                return props.allSelectIsOrNo;
            },
            set(value){
                console.log(value);
                props.allSelectInfo(value);
            }
        });
        const delSelectAll = ()=>{
            props.selectAllDel();
        }
        return {
            checked,
            allSelect,
            delSelectAll
        }
    }
})
</script>

<style scoped>
.footer{
    display:flex;
    justify-content: space-between;
    line-height:40px;
}
</style>